<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" href="/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>礼上来往</title>
  </head>
  <body>
    <div id="app"></div>
    <script type="module" src="/src/main.ts"></script>
    <script>
      // PostCSS 插件，解决移动端 vh 的问题
      const customViewportCorrectionVariable = 'vh';
      function setViewportProperty(doc) {
        let prevClientHeight;
        const customVar = `--${customViewportCorrectionVariable || 'vh'}`;
        function handleResize() {
          const { clientHeight } = doc;
          if (clientHeight === prevClientHeight) return;
          requestAnimationFrame(function updateViewportHeight() {
            doc.style.setProperty(customVar, `${clientHeight * 0.01}px`);
            prevClientHeight = clientHeight;
          });
        }
        handleResize();
        return handleResize;
      }
      window.addEventListener('resize', setViewportProperty(document.documentElement));
    </script>
  </body>
</html>
